<!DOCTYPE html>
<html lang="en">
<head>
    <title>登录</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="/bootstrap/css/bootstrap.min.css" /><!-- bootstrap -->
    <script type="text/javascript" src="/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/jquery-validation/jquery.validate.min.js"></script> <!-- jquery-validator -->
    <script type="text/javascript" src="/jquery-validation/localization/messages_zh.min.js"></script>
    <script type="text/javascript" src="/layer/layer.js"></script><!-- layer -->
    <script type="text/javascript" src="/js/md5.min.js"></script><!-- md5.js -->
    <script type="text/javascript" src="/js/common.js"></script><!-- common.js -->
    <script type="text/javascript">
            function doLogin() {
                var mobile = $("#mobile").val();
                var password = $("#password").val();

                if ("" === password+""){
                    layer.msg("密码不能为空");
                }else{
                    //密码加密
                    var str = "" + passsword_salt.charAt(0) + passsword_salt.charAt(2) + password + passsword_salt.charAt(4) + passsword_salt.charAt(6);
                    password = md5(str);
                    //发送ajax请求
                    $.ajax({
                        url:"http://localhost:9000/member/api/tokens/login",
                        type:"POST",
                        data:{"mobile":mobile,"password":password},
                        xhrFields:{withCredentials:true},
                        success:function (res) {
                            if(res.code === 0){
                                location.href = "/goods.html";
                            }else{
                                layer.msg(res.msg);
                            }
                        }
                    });
                }
            }
    </script>
</head>
<body>
<form name="loginForm" id="loginForm" method="post"  style="width:50%; margin:0 auto">
    <h2 style="text-align:center; margin-bottom: 20px">用户登录</h2>
    <div class="form-group">
        <div class="row">
            <label class="form-label col-md-4">请输入手机号码</label>
            <div class="col-md-5">
                <input id="mobile" name = "mobile" class="form-control" type="text" placeholder="手机号码" required="true"  minlength="11" maxlength="11" />
            </div>
            <div class="col-md-1">
            </div>
        </div>
    </div>

    <div class="form-group">
        <div class="row">
            <label class="form-label col-md-4">请输入密码</label>
            <div class="col-md-5">
                <input id="password" name="password" class="form-control" type="password"  placeholder="密码" required="true" minlength="6" maxlength="16" />
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-5">
            <button class="btn btn-primary btn-block" type="reset" onclick="reset()">重置</button>
        </div>
        <div class="col-md-5">
            <button class="btn btn-primary btn-block" type="button" onclick="doLogin()">登录</button>
        </div>
    </div>
</form>

</body>
</html>